﻿<html>
  <head>
    <title>Basecamp календарик</title>
    <link rel="icon" href="/static/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" type="text/css" href="/static/styles.css" />
    <script type="text/javascript">
    function submitLogin() {
        var loginForm = document.getElementById('login_form');
        var fields = ['password', 'login', 'subdomain'];
        for (field in fields)
            if (loginForm[fields[field]].value == '') {
                document.getElementById('error_msg').innerHTML = 'Всі поля мають бути заповнені!';
                return;
            }
        loginForm.submit();
    }
    </script>
  </head>
  <body>
    <div id="wrapper">
      <h1>Календарик</h1>
      <h2>Введи свій Basecamp логін/пароль</h2>
      <p>і подивись скільки часу ти працював цього місяця</p>
      <p id="error_msg">
      {% if error_msg %}
      Логін/пароль невірні!
      {% endif %}
      </p>
      <form id="login_form" action="/login" method="POST" >
        <p>
          <label>Піддомен *.updatelog.com</label>
          <input type="text" name="subdomain" value="{{ subdomain }}"></input>
        </p>
        <p>
          <label style="float: right; font-size: 75%;">запам'ятати піддомен</label>
          {% if subdomain %}
          <input type="checkbox" name="save_subdomain" checked="checked" />
          {% else %}
          <input type="checkbox" name="save_subdomain" />
          {% endif %}
          <span style="display: block; clear: both;"></span>
        </p>
        <p>
          <label>Логін</label>
          <input type="text" name="login" value=""></input>
        </p>
        <p>
          <label>Пароль</label>
          <input type="password" name="password" value=""></input>
        </p>
        <p>
          <input type="button" name="submit_btn" value="Відіслати" onclick="submitLogin();" />
        </p>
      </form>
    </div>
  </body>
</html>
